class GameMenu {
    constructor(root) {
        this.root = root
        this.$menu = $(`
<div class="game-menu">
    <div class="game-menu-field">
        <div class="game-menu-field-item game-menu-field-item-single-mode">
            单人模式
        </div>
        <div class="game-menu-field-item game-menu-field-item-multi-mode">
            多人模式
        </div>
        <div class="game-menu-field-item game-menu-field-item-settings">
            退出
        </div>
    </div>
</div>
`)
        this.$menu.hide()
        this.root.$game.append(this.$menu)
        this.$single_mode = this.$menu.find('.game-menu-field-item-single-mode')
        this.$multi_mode = this.$menu.find('.game-menu-field-item-multi-mode')
        this.$settings = this.$menu.find('.game-menu-field-item-settings')

        this.start()

    }

    start() {
       this.add_listening_event()
    }

    add_listening_event() {
        let out = this
        this.$single_mode.click(function(){
            out.hide()
            out.root.playground.show("single mode")
        })
        this.$multi_mode.click(function(){
            out.hide()
            out.root.playground.show("multi mode")
        })
        this.$settings.click(function(){
            out.root.settings.logout_on_remote()
        })
    }

    show() {  //show menu
        this.$menu.show()
    }

    hide() {  //hide menu
        this.$menu.hide()
    }
}
